import { cx } from "cva";
import BookOpen from "./animated-icons/BookOpen";

export enum IconId {
  "Arrow Left" = "arrow-left",
  "Arrow Right" = "arrow-right",
  "Arrow Up Right" = "arrow-up-right",
  Award = "award",
  "Badge Info" = "badge-info",
  Binary = "binary",
  "Book Open" = "book-open",
  Braces = "braces",
  Build = "build",
  Calendar = "calendar",
  Check = "check",
  "Chevron Down" = "chevron-down",
  "Chevron Right" = "chevron-right",
  "Chevron Up" = "chevron-up",
  Close = "close",
  "Codemod Studio" = "codemod-studio",
  "Codemod Dot Pulse" = "codemod-dot-pulse",
  "Codemod Brand" = "codemod-brand",
  Command = "command",
  Copy = "copy",
  Drafting = "drafting",
  "File Json 2" = "file-json-2",
  File = "file",
  Filter = "filter",
  Group = "group",
  Home = "home",
  "Layers 2" = "layers-2",
  Loading = "loading",
  Location = "location",
  Mail = "mail",
  Medal = "medal",
  Moon = "moon",
  "Panel Right Close" = "panel-right-close",
  "Panel Right Open" = "panel-right-open",
  Pause = "pause",
  Play = "play",
  Refresh = "refresh",
  Search = "search",
  "Search X" = "search-x",
  "Shield Check Solid" = "shield-check-solid",
  "Shield Check" = "shield-check",
  Slack = "slack",
  Star = "star",
  Sun = "sun",
  Terminal = "terminal",
  Type = "type",
  Tip = "tip",
  User = "user",
  Vscode = "vscode",
}

export enum TechLogoId {
  "Ant Design" = "ant-design",
  Bull = "bull",
  EmberJS = "emberjs",
  "React Router" = "react-router",
  RedwoodJS = "redwoodjs",
  NextJS = "nextjs",
  MSW = "msw",
  i18n = "i18n",
  Slack = "slack",
  LinkedIn = "linkedin",
  Github = "github",
  "Twitter / X" = "twitter/x",
}

const iconValues: string[] = Object.values(IconId);
export type IconName = (typeof iconValues)[number];

const logoValues: string[] = Object.values(TechLogoId);
export type LogoName = (typeof logoValues)[number];

type IconProps = {
  name: IconName;
  className?: string;
};
type LogoProps = {
  name: LogoName;
  className?: string;
  pathClassName?: string;
};

export const TechLogo = ({ name, className, pathClassName }: LogoProps) => {
  switch (name) {
    case "ant-design":
      return (
        <svg
          title="Ant Design"
          width="256px"
          height="256px"
          viewBox="0 0 256 256"
          version="1.1"
          xmlns="http://www.w3.org/2000/svg"
          xmlnsXlink="http://www.w3.org/1999/xlink"
          className={className}
        >
          <defs>
            <linearGradient
              x1="62.1023273%"
              y1="0%"
              x2="108.19718%"
              y2="37.8635764%"
              id="linearGradient-1"
            >
              <stop stopColor="#4285EB" offset="0%" />
              <stop stopColor="#2EC7FF" offset="100%" />
            </linearGradient>
            <linearGradient
              x1="69.644116%"
              y1="0%"
              x2="54.0428975%"
              y2="108.456714%"
              id="linearGradient-2"
            >
              <stop stopColor="#29CDFF" offset="0%" />
              <stop stopColor="#148EFF" offset="37.8600687%" />
              <stop stopColor="#0A60FF" offset="100%" />
            </linearGradient>
            <linearGradient
              x1="69.6908165%"
              y1="-12.9743587%"
              x2="16.7228981%"
              y2="117.391248%"
              id="linearGradient-3"
            >
              <stop stopColor="#FA816E" offset="0%" />
              <stop stopColor="#F74A5C" offset="41.472606%" />
              <stop stopColor="#F51D2C" offset="100%" />
            </linearGradient>
            <linearGradient
              x1="68.1279872%"
              y1="-35.6905737%"
              x2="30.4400914%"
              y2="114.942679%"
              id="linearGradient-4"
            >
              <stop stopColor="#FA8E7D" offset="0%" />
              <stop stopColor="#F74A5C" offset="51.2635191%" />
              <stop stopColor="#F51D2C" offset="100%" />
            </linearGradient>
          </defs>
          <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
            <g fillRule="nonzero">
              <path
                d="M116.850078,4.54548777 L4.52892893,116.774275 C-1.50964298,122.807881 -1.50964298,132.553174 4.52892893,138.586781 L116.850078,250.815568 C122.88865,256.849175 132.641964,256.849175 138.680536,250.815568 L185.77519,203.759641 C191.183172,198.356106 191.183172,189.595245 185.77519,184.191711 C180.367208,178.788175 171.599136,178.788175 166.191154,184.191711 L130.489075,219.864432 C128.986084,221.366187 126.704989,221.366187 125.201998,219.864432 L35.5055378,130.241729 C34.0025469,128.739974 34.0025469,126.460755 35.5055378,124.959 L125.201998,35.3362976 C126.704989,33.8345425 128.986084,33.8345425 130.489075,35.3362976 L166.191154,71.009019 C171.599136,76.4125539 180.367208,76.4125539 185.77519,71.009019 C191.183172,65.605484 191.183172,56.8446228 185.77519,51.4410879 L138.685727,4.39028013 C132.622361,-1.51275655 122.86548,-1.46496803 116.850078,4.54548777 Z"
                fill="url(#linearGradient-1)"
              />
              <path
                d="M116.850078,4.54548777 L4.52892893,116.774275 C-1.50964298,122.807881 -1.50964298,132.553174 4.52892893,138.586781 L116.850078,250.815568 C122.88865,256.849175 132.641964,256.849175 138.680536,250.815568 L185.77519,203.759641 C191.183172,198.356106 191.183172,189.595245 185.77519,184.191711 C180.367208,178.788175 171.599136,178.788175 166.191154,184.191711 L130.489075,219.864432 C128.986084,221.366187 126.704989,221.366187 125.201998,219.864432 L35.5055378,130.241729 C34.0025469,128.739974 34.0025469,126.460755 35.5055378,124.959 L125.201998,35.3362976 C128.944397,32.1100005 135.050525,25.5752137 144.017405,24.0468431 C150.68143,22.9109853 157.967021,25.4109881 165.874177,31.546852 C160.587747,26.2647619 151.52493,17.2125713 138.685727,4.39028013 C132.622361,-1.51275655 122.86548,-1.46496803 116.850078,4.54548777 Z"
                fill="url(#linearGradient-2)"
              />
              <path
                d="M196.646643,173.754365 C202.054625,179.157899 210.822696,179.157899 216.230677,173.754365 L250.970004,139.043604 C257.008576,133.009998 257.008576,123.264704 250.970711,117.231801 L215.928547,82.342615 C210.507763,76.945494 201.736908,76.953277 196.325725,82.3600099 C190.917743,87.7635449 190.917743,96.524406 196.325725,101.927941 L219.993396,125.57615 C221.496387,127.077905 221.496387,129.357124 219.993396,130.858879 L196.646643,154.186433 C191.23866,159.589968 191.23866,168.350829 196.646643,173.754365 Z"
                fill="url(#linearGradient-3)"
              />
              <ellipse
                fill="url(#linearGradient-4)"
                cx="128.326913"
                cy="128.241672"
                rx="30.3267102"
                ry="30.3017724"
              />
            </g>
          </g>
        </svg>
      );

    case "bull":
      return null;

    case "twitter/x":
      return (
        <svg
          className={className}
          width="20"
          height="21"
          viewBox="0 0 20 21"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            fillRule="evenodd"
            clipRule="evenodd"
            d="M16.6927 16.8678L11.4536 9.25657L17.2613 2.5H15.9327L14.7954 3.81675L10.8613 8.39576L7.11365 2.9512L6.80315 2.5H2.19809L3.32122 4.13212L8.30406 11.372L8.30404 11.372L2.18005 18.4999H3.50865L8.89634 12.2319L8.89636 12.2319L8.89647 12.232L12.9002 18.0492L13.2108 18.5H17.8159L16.6927 16.8679V16.8678ZM10.1591 9.213L6.25574 3.54166H4.17953L9.00619 10.5544L9.00624 10.5544L9.59854 11.4146L9.59849 11.4147L9.59854 11.4148L13.7581 17.4582V17.4581H15.8343L10.7514 10.0733L10.1591 9.213Z"
            fill="black"
          />
        </svg>
      );

    case "linkedin":
      return (
        <svg
          className={className}
          width="20"
          height="21"
          viewBox="0 0 20 21"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            fillRule="evenodd"
            clipRule="evenodd"
            d="M16.2222 18.5H3.77778C2.79594 18.5 2 17.7041 2 16.7222V4.27778C2 3.29594 2.79594 2.5 3.77778 2.5H16.2222C17.2041 2.5 18 3.29594 18 4.27778V16.7222C18 17.7041 17.2041 18.5 16.2222 18.5ZM13.4035 16.2778H15.7778V11.4003C15.7778 9.33654 14.6079 8.33871 12.9739 8.33871C11.3391 8.33871 10.6511 9.61176 10.6511 9.61176V8.57407H8.36296V16.2778H10.6511V12.2338C10.6511 11.1502 11.1499 10.5054 12.1046 10.5054C12.9822 10.5054 13.4035 11.1251 13.4035 12.2338V16.2778ZM4.22222 6.14377C4.22222 6.92881 4.85379 7.56533 5.63319 7.56533C6.41259 7.56533 7.04378 6.92881 7.04378 6.14377C7.04378 5.35874 6.41259 4.72222 5.63319 4.72222C4.85379 4.72222 4.22222 5.35874 4.22222 6.14377ZM6.83765 16.2778H4.45168V8.57407H6.83765V16.2778Z"
            fill="black"
          />
        </svg>
      );

    case "github":
      return (
        <svg
          className={className}
          width="20"
          height="21"
          viewBox="0 0 20 21"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            fillRule="evenodd"
            clipRule="evenodd"
            d="M10 1.5C5.02931 1.5 1 5.63094 1 10.7283C1 14.8049 3.57851 18.2643 7.15513 19.4839C7.60512 19.5687 7.76892 19.2841 7.76892 19.039C7.76892 18.8206 7.76172 18.2393 7.75722 17.4701C5.25342 18.0275 4.72512 16.2328 4.72512 16.2328C4.31651 15.1659 3.72612 14.8823 3.72612 14.8823C2.90891 14.311 3.78821 14.3221 3.78821 14.3221C4.69092 14.3866 5.16611 15.2729 5.16611 15.2729C5.96891 16.6825 7.27302 16.2752 7.78512 16.0394C7.86793 15.4433 8.10013 15.037 8.35753 14.8068C6.35952 14.5736 4.25802 13.7813 4.25802 10.2456C4.25802 9.23861 4.60901 8.41408 5.18411 7.76919C5.09142 7.53611 4.78271 6.59735 5.27231 5.32785C5.27231 5.32785 6.02831 5.0791 7.74733 6.27306C8.48152 6.0681 9.23903 5.9637 10 5.96259C10.765 5.96628 11.5345 6.06855 12.2536 6.27306C13.9717 5.0791 14.726 5.32693 14.726 5.32693C15.2173 6.59735 14.9078 7.53611 14.8159 7.76919C15.3919 8.41408 15.7411 9.23861 15.7411 10.2456C15.7411 13.7905 13.6361 14.5708 11.6317 14.7993C11.9548 15.084 12.2419 15.6469 12.2419 16.5083C12.2419 17.7409 12.2311 18.7368 12.2311 19.039C12.2311 19.286 12.3931 19.5733 12.8503 19.483C14.6426 18.8678 16.2005 17.6914 17.3039 16.1205C18.4075 14.5495 19.0008 12.6632 19 10.7283C19 5.63094 14.9699 1.5 10 1.5Z"
            fill="black"
            className={pathClassName}
          />
        </svg>
      );

    case "slack":
      return (
        <svg
          className={className}
          width="20"
          height="21"
          viewBox="0 0 20 21"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            fillRule="evenodd"
            clipRule="evenodd"
            d="M6.21662 4.18155C6.21662 5.1115 6.96822 5.8631 7.89817 5.8631H9.57973V4.18155C9.57973 3.2516 8.82812 2.5 7.89817 2.5C6.96822 2.5 6.21662 3.2516 6.21662 4.18155ZM9.57973 8.39817C9.57973 7.46822 8.82812 6.71662 7.89817 6.71662H3.68155C2.7516 6.71662 2 7.46822 2 8.39817C2 9.32812 2.7516 10.0797 3.68155 10.0797H7.89817C8.82812 10.0797 9.57973 9.32812 9.57973 8.39817ZM3.69388 14.2954C4.62383 14.2954 5.37543 13.5438 5.37543 12.6138V10.9323H3.69388C2.76393 10.9323 2.01233 11.6839 2.01233 12.6138C2.01233 13.5438 2.76393 14.2954 3.69388 14.2954ZM7.89776 10.9323C6.96781 10.9323 6.21621 11.6839 6.21621 12.6138V16.8177C6.21621 17.7477 6.96781 18.4993 7.89776 18.4993C8.82771 18.4993 9.57932 17.7477 9.57932 16.8177V12.6138C9.57932 11.6839 8.82771 10.9323 7.89776 10.9323ZM14.6375 8.39817C14.6375 7.46822 15.3891 6.71662 16.319 6.71662C17.249 6.71662 18.0006 7.46822 18.0006 8.39817C18.0006 9.32812 17.249 10.0797 16.319 10.0797H14.6375V8.39817ZM13.7967 8.39817C13.7967 9.32812 13.0451 10.0797 12.1151 10.0797C11.1852 10.0797 10.4336 9.32812 10.4336 8.39817V4.18155C10.4336 3.2516 11.1852 2.5 12.1151 2.5C13.0451 2.5 13.7967 3.2516 13.7967 4.18155V8.39817ZM13.7967 16.8177C13.7967 15.8878 13.0451 15.1362 12.1151 15.1362H10.4336V16.8177C10.4336 17.7477 11.1852 18.4993 12.1151 18.4993C13.0451 18.4993 13.7967 17.7477 13.7967 16.8177ZM10.4336 12.6138C10.4336 13.5438 11.1852 14.2954 12.1151 14.2954H16.3318C17.2617 14.2954 18.0133 13.5438 18.0133 12.6138C18.0133 11.6839 17.2617 10.9323 16.3318 10.9323H12.1151C11.1852 10.9323 10.4336 11.6839 10.4336 12.6138Z"
            fill="black"
          />
        </svg>
      );

    case "emberjs":
      return (
        <svg
          width="128"
          height="128"
          viewBox="0 0 128 128"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <g fill="none" fillRule="evenodd">
            <path
              d="M64 0c35.346 0 64 28.654 64 64 0 35.346-28.654 64-64 64-35.346 0-64-28.654-64-64C0 28.654 28.654 0 64 0z"
              fill="#E05C43"
              fillRule="nonzero"
            />
            <path
              d="M65.265 24.128c8.246-.163 14.073 2.073 19.087 9.19 10.934 27.109-28.147 41.1-29.714 41.65l-.049.016s-1.18 7.363 10.028 7.08c13.793 0 28.294-10.691 33.81-15.21a3.293 3.293 0 0 1 4.468.265l4.13 4.29a3.291 3.291 0 0 1 .085 4.491c-3.59 3.997-12.014 12.203-24.696 17.504 0 0-21.16 9.798-35.42.52-8.503-5.53-10.842-12.151-11.793-19.038.005 0-10.324-.524-16.957-3.114-6.635-2.592.049-10.411.049-10.411s2.04-3.233 5.92 0c3.883 3.228 11.13 1.772 11.13 1.772.646-5.099 1.72-11.828 4.884-18.93 6.632-14.885 16.789-19.915 25.038-20.075zm4.853 14.915c-4.369-4.21-16.984 4.202-17.471 23.45 0 0 3.724 1.134 11.97-4.53 8.25-5.661 9.87-14.718 5.501-18.92z"
              fill="#FFFFFF"
            />
          </g>
        </svg>
      );

    case "react-router":
      return (
        <svg
          width="20"
          height="21"
          viewBox="0 0 20 21"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M15.5544 8.1053C14.9835 7.92017 14.6886 7.98259 14.0898 7.9151C13.164 7.81095 12.7952 7.43781 12.6387 6.47745C12.5511 5.94137 12.6545 5.15645 12.431 4.67049C12.0035 3.74389 11.0032 3.32832 9.99823 3.56552C9.14975 3.76607 8.44376 4.6406 8.40464 5.53827C8.35994 6.56321 8.92621 7.43775 9.89857 7.73955C10.3605 7.8832 10.8514 7.95552 11.3338 7.99215C12.2186 8.05869 12.2866 8.56592 12.526 8.98342C12.6769 9.24664 12.8231 9.50601 12.8231 10.2909C12.8231 11.0757 12.6759 11.3351 12.526 11.5983C12.2866 12.0149 11.9914 12.2877 11.1066 12.3552C10.6241 12.3919 10.1323 12.4642 9.67133 12.6079C8.69897 12.9106 8.13269 13.7842 8.17739 14.8091C8.21651 15.7068 8.9225 16.5813 9.77098 16.7819C10.7759 17.02 11.7762 16.6035 12.2037 15.6769C12.4282 15.1909 12.5511 14.6404 12.6387 14.1043C12.7961 13.1439 13.1649 12.7708 14.0898 12.6667C14.6886 12.5992 15.3084 12.6667 15.8696 12.3379C16.4627 11.891 16.9925 11.2204 16.9925 10.2909C16.9925 9.36138 16.4215 8.38684 15.5544 8.1053Z"
            fill="#F44250"
          />
          <path
            d="M6.05594 12.4691C4.88893 12.4691 3.93701 11.4856 3.93701 10.2798C3.93701 9.07406 4.88893 8.09052 6.05594 8.09052C7.22296 8.09052 8.17488 9.07406 8.17488 10.2798C8.17488 11.4846 7.22201 12.4691 6.05594 12.4691Z"
            fill="#121212"
          />
          <path
            d="M2.15248 16.9184C0.987339 16.9155 0.0382335 15.9281 0.0410218 14.7214C0.0438379 13.5166 0.999497 12.536 2.16746 12.5398C3.33352 12.5427 4.28262 13.5301 4.27889 14.7368C4.27607 15.9407 3.32041 16.9213 2.15248 16.9184Z"
            fill="#121212"
          />
          <path
            d="M17.8969 16.9184C16.7281 16.9251 15.7687 15.9484 15.7621 14.7455C15.7556 13.5379 16.701 12.5466 17.8651 12.5398C19.0341 12.5331 19.9933 13.5099 20 14.7127C20.0064 15.9194 19.0612 16.9116 17.8969 16.9184Z"
            fill="#121212"
          />
        </svg>
      );

    case "redwoodjs":
      return (
        <svg
          width="20"
          height="21"
          viewBox="0 0 20 21"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <g clipPath="url(#clip0_2904_589)">
            <path
              fillRule="evenodd"
              clipRule="evenodd"
              d="M6.35432 4.10248L9.74226 6.4882C9.81873 6.54072 9.90805 6.56948 9.9997 6.5711C10.0915 6.57042 10.1811 6.54157 10.2572 6.4882L13.6477 4.09445C13.7794 3.99714 13.8521 3.83492 13.8388 3.66754C13.8256 3.50018 13.7285 3.35242 13.5833 3.2787L10.1954 1.54825C10.0668 1.48392 9.91712 1.48392 9.7886 1.54825L6.41096 3.2787C6.2631 3.35281 6.16471 3.50344 6.15302 3.67354C6.14133 3.84365 6.2181 4.00727 6.35432 4.10248ZM11.1505 7.23707C11.1507 7.39527 11.2258 7.54325 11.3513 7.63291L14.0673 9.54791C14.2412 9.67157 14.4738 9.65612 14.6311 9.51045L16.9095 7.40825C17.011 7.31467 17.0674 7.17913 17.0634 7.03817C17.0594 6.89721 16.9955 6.76532 16.8889 6.67808L14.7135 4.88344C14.5554 4.75386 14.3348 4.7452 14.1677 4.86204L11.3513 6.84926C11.228 6.93728 11.1532 7.08171 11.1505 7.23707ZM4.39517 9.8421C4.50495 9.94384 4.56138 10.0939 4.54707 10.246C4.53282 10.3989 4.44716 10.5349 4.31794 10.6097L2.69605 11.6127C2.53164 11.7141 2.32406 11.6994 2.17432 11.5759C2.02458 11.4524 1.9638 11.2457 2.02155 11.0564L2.62139 9.10927C2.66845 8.95501 2.78772 8.83612 2.93805 8.79367C3.08826 8.74858 3.25024 8.78811 3.3654 8.89798L4.39517 9.8421ZM13.192 10.0454L10.2597 7.97525C10.1039 7.86707 9.90067 7.86707 9.74484 7.97525L6.81256 10.0454C6.69594 10.1286 6.62205 10.2625 6.61175 10.4091C6.60416 10.5568 6.66089 10.7002 6.76622 10.7996L9.69593 13.5036C9.78042 13.5813 9.88941 13.6242 10.0023 13.624C10.1151 13.6239 10.224 13.5811 10.3086 13.5036L13.2383 10.7996C13.344 10.7006 13.4 10.5566 13.3902 10.4091C13.382 10.2625 13.3088 10.1281 13.192 10.0454ZM5.37089 9.51045L3.09509 7.40823C2.99269 7.31227 2.93619 7.17432 2.94063 7.03113C2.9431 6.88999 3.00641 6.75746 3.11311 6.67005L5.2885 4.86472C5.44773 4.7355 5.66875 4.72688 5.83686 4.84332L8.65071 6.83054C8.7813 6.91888 8.86006 7.06981 8.86006 7.23172C8.86006 7.39361 8.7813 7.54456 8.65071 7.63291L5.93726 9.54789C5.76234 9.67103 5.52939 9.65562 5.37089 9.51045ZM17.0562 12.5301L14.7392 11.0991C14.5672 10.9922 14.3481 11.0138 14.1986 11.1526L11.3667 13.7604C11.2473 13.8704 11.1912 14.0369 11.2184 14.2003C11.2457 14.3637 11.3525 14.5009 11.5006 14.5627L15.4292 16.2049C15.4831 16.228 15.5408 16.2398 15.5991 16.2397C15.7814 16.2403 15.9469 16.1291 16.0213 15.9562L17.239 13.1425C17.3381 12.9199 17.2592 12.6554 17.0562 12.5301ZM17.378 9.10928L17.9779 11.0564H17.9727C18.0171 11.202 17.9919 11.3609 17.9049 11.4841C17.8179 11.6072 17.6795 11.6798 17.5325 11.6795C17.45 11.6798 17.369 11.6567 17.2982 11.6127L15.6737 10.6097C15.5472 10.5333 15.4645 10.3975 15.4523 10.246C15.4372 10.0938 15.4937 9.94331 15.6042 9.84212L16.634 8.89532C16.7503 8.78775 16.9111 8.74851 17.0614 8.79101C17.2116 8.83527 17.3305 8.95477 17.378 9.10928ZM8.78458 14.199C8.81227 14.0362 8.75671 13.8702 8.63784 13.7604L5.80596 11.1526C5.65643 11.0138 5.4374 10.9922 5.26533 11.0991L2.94834 12.5301C2.74773 12.656 2.66836 12.9171 2.76299 13.1399L3.98327 15.9535C4.08436 16.1881 4.34574 16.2979 4.57539 16.2022L8.50139 14.5601C8.64956 14.4987 8.75669 14.3622 8.78458 14.199ZM10.1748 15.0014L13.3259 16.3173C13.4799 16.3853 13.5864 16.5348 13.6039 16.7077C13.6239 16.8829 13.5485 17.055 13.4082 17.1544L10.2546 19.4144C10.179 19.4692 10.0893 19.499 9.99714 19.5C9.90507 19.4985 9.81549 19.4687 9.73969 19.4144L6.5886 17.1544C6.44786 17.0553 6.37156 16.8833 6.39035 16.7077C6.41139 16.533 6.52167 16.3836 6.6787 16.3173L9.82979 15.0014C9.94061 14.9558 10.064 14.9558 10.1748 15.0014Z"
              fill="#BF4722"
            />
          </g>
          <defs>
            <clipPath id="clip0_2904_589">
              <rect
                width="16"
                height="18"
                fill="white"
                transform="translate(2 1.5)"
              />
            </clipPath>
          </defs>
        </svg>
      );

    case "nextjs":
      return (
        <svg
          height="1024pt"
          viewBox=".5 -.2 1023 1024.1"
          width="1024pt"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path d="m478.5.6c-2.2.2-9.2.9-15.5 1.4-145.3 13.1-281.4 91.5-367.6 212-48 67-78.7 143-90.3 223.5-4.1 28.1-4.6 36.4-4.6 74.5s.5 46.4 4.6 74.5c27.8 192.1 164.5 353.5 349.9 413.3 33.2 10.7 68.2 18 108 22.4 15.5 1.7 82.5 1.7 98 0 68.7-7.6 126.9-24.6 184.3-53.9 8.8-4.5 10.5-5.7 9.3-6.7-.8-.6-38.3-50.9-83.3-111.7l-81.8-110.5-102.5-151.7c-56.4-83.4-102.8-151.6-103.2-151.6-.4-.1-.8 67.3-1 149.6-.3 144.1-.4 149.9-2.2 153.3-2.6 4.9-4.6 6.9-8.8 9.1-3.2 1.6-6 1.9-21.1 1.9h-17.3l-4.6-2.9c-3-1.9-5.2-4.4-6.7-7.3l-2.1-4.5.2-200.5.3-200.6 3.1-3.9c1.6-2.1 5-4.8 7.4-6.1 4.1-2 5.7-2.2 23-2.2 20.4 0 23.8.8 29.1 6.6 1.5 1.6 57 85.2 123.4 185.9s157.2 238.2 201.8 305.7l81 122.7 4.1-2.7c36.3-23.6 74.7-57.2 105.1-92.2 64.7-74.3 106.4-164.9 120.4-261.5 4.1-28.1 4.6-36.4 4.6-74.5s-.5-46.4-4.6-74.5c-27.8-192.1-164.5-353.5-349.9-413.3-32.7-10.6-67.5-17.9-106.5-22.3-9.6-1-75.7-2.1-84-1.3zm209.4 309.4c4.8 2.4 8.7 7 10.1 11.8.8 2.6 1 58.2.8 183.5l-.3 179.8-31.7-48.6-31.8-48.6v-130.7c0-84.5.4-132 1-134.3 1.6-5.6 5.1-10 9.9-12.6 4.1-2.1 5.6-2.3 21.3-2.3 14.8 0 17.4.2 20.7 2z" />
          <path d="m784.3 945.1c-3.5 2.2-4.6 3.7-1.5 2 2.2-1.3 5.8-4 5.2-4.1-.3 0-2 1-3.7 2.1zm-6.9 4.5c-1.8 1.4-1.8 1.5.4.4 1.2-.6 2.2-1.3 2.2-1.5 0-.8-.5-.6-2.6 1.1zm-5 3c-1.8 1.4-1.8 1.5.4.4 1.2-.6 2.2-1.3 2.2-1.5 0-.8-.5-.6-2.6 1.1zm-5 3c-1.8 1.4-1.8 1.5.4.4 1.2-.6 2.2-1.3 2.2-1.5 0-.8-.5-.6-2.6 1.1zm-7.6 4c-3.8 2-3.6 2.8.2.9 1.7-.9 3-1.8 3-2 0-.7-.1-.6-3.2 1.1z" />
        </svg>
      );

    case "msw":
      return (
        <svg
          width="20"
          height="21"
          viewBox="0 0 20 21"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <g clipPath="url(#clip0_2904_591)">
            <path
              d="M4.19297 4.28391C3.47038 4.87064 3.00109 5.72191 2.90122 6.66881L2 15.247L2.00469 15.3946L2.00704 15.4443C2.04103 15.9842 2.27089 16.4862 2.64549 16.8618C3.05292 17.2703 3.60743 17.5054 4.19487 17.5049L12.6093 17.498L12.6974 17.4967C13.5548 17.4685 14.3507 17.1467 14.9697 16.5869C15.6742 15.9497 16.0848 15.0684 16.1334 14.1364C16.1821 13.2044 15.8655 12.2848 15.2311 11.5772L9.038 4.66889L8.97819 4.604C8.38416 3.98242 7.61377 3.60308 6.7854 3.51495C5.84263 3.41464 4.91556 3.69719 4.19297 4.28391ZM6.45149 6.681C6.53636 6.69003 6.61532 6.72891 6.67437 6.79067L12.8754 13.7075C12.9415 13.7812 12.9729 13.8727 12.9679 13.9698C12.9628 14.0669 12.922 14.1545 12.8486 14.2209C12.7852 14.2782 12.7036 14.3112 12.6184 14.314L5.28464 14.3202L6.05354 7.00354C6.06387 6.90561 6.11055 6.82094 6.18584 6.7598C6.26113 6.69867 6.35334 6.67056 6.45149 6.681Z"
              fill="#70211D"
            />
            <path
              d="M15.796 2.5L4.20042 2.50949L4.10606 2.51185L4.05295 2.51458C3.56226 2.5481 3.09649 2.7459 2.73045 3.07692C2.29208 3.47336 2.03597 4.02316 2.00571 4.60303C1.97545 5.18289 2.17294 5.75657 2.56765 6.19686L12.9418 17.769L13.0066 17.8379L13.0442 17.8757C13.397 18.2199 13.8549 18.4355 14.3447 18.4876C14.9313 18.5501 15.5096 18.3738 15.9592 18.0087C16.4088 17.6437 16.7015 17.1127 16.7637 16.5235L18 4.76714L17.9953 4.61882L17.993 4.56917C17.9588 4.02701 17.728 3.52297 17.3519 3.14578C16.9427 2.73552 16.3859 2.49952 15.796 2.5ZM14.7159 5.68422L13.8398 14.013L6.37986 5.69099L14.7159 5.68422Z"
              fill="#ED7344"
            />
          </g>
          <defs>
            <clipPath id="clip0_2904_591">
              <rect
                width="16"
                height="16"
                fill="white"
                transform="translate(2 2.5)"
              />
            </clipPath>
          </defs>
        </svg>
      );

    case "i18n":
      return (
        <svg
          width="20"
          height="21"
          viewBox="0 0 20 21"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <g clipPath="url(#clip0_2904_592)">
            <path
              d="M12.2721 2.70782V6.44345L16.47 17.2252C16.47 17.2252 17.7515 19.8584 14.0861 20.5H5.72417C5.72417 20.5 2.30778 20.1435 3.12681 17.4384L7.53832 6.4436V2.70782H12.2721Z"
              fill="#009688"
            />
            <path
              d="M12.3617 2.27346H7.32592C6.91806 2.27346 6.5863 1.91063 6.5863 1.46234C6.5863 1.01377 6.91792 0.65094 7.32592 0.65094H12.3617C12.7714 0.65094 13.1026 1.01377 13.1026 1.46234C13.1026 1.91063 12.7713 2.27346 12.3617 2.27346Z"
              fill="#004D40"
            />
            <path
              d="M11.0322 8.80731C11.5725 8.80731 12.0132 9.3353 12.0132 9.98917C12.0132 10.6402 11.5722 11.1695 11.0322 11.1695C10.4905 11.1695 10.0511 10.6402 10.0511 9.98917C10.0511 9.33501 10.4905 8.80731 11.0322 8.80731Z"
              fill="#0B151E"
            />
            <path
              d="M8.02079 11.8732C8.4775 11.8732 8.84773 11.427 8.84773 10.8765C8.84773 10.3261 8.4775 9.87982 8.02079 9.87982C7.56408 9.87982 7.19385 10.3261 7.19385 10.8765C7.19385 11.427 7.56408 11.8732 8.02079 11.8732Z"
              fill="#0B151E"
            />
            <path
              d="M12.6455 6.19582V4.41907C12.6455 4.41907 14.8986 3.9223 16.0246 6.54297C16.0246 6.54297 14.2698 7.8215 12.6455 6.19582Z"
              fill="#004D40"
            />
            <path
              d="M7.12701 6.19582V4.41907C7.12701 4.41907 4.87363 3.9223 3.74817 6.54297C3.74817 6.54297 5.50132 7.8215 7.12701 6.19582Z"
              fill="#004D40"
            />
            <path
              d="M14.0001 13.5485C10.3363 12.412 7.25598 13.0221 5.75042 13.4834L4.2322 17.1377C3.54869 19.3193 6.4027 19.606 6.4027 19.606H13.3867C16.448 19.0888 15.3781 16.9665 15.3781 16.9665L14.0001 13.5485Z"
              fill="#0B151E"
            />
            <path
              d="M8.71992 14.9064C8.71992 15.3004 8.19035 15.6209 7.53807 15.6209C6.88578 15.6209 6.35779 15.3003 6.35779 14.9064C6.35779 14.5107 6.88578 14.1913 7.53807 14.1913C8.19064 14.1916 8.71992 14.5107 8.71992 14.9064Z"
              fill="#004D40"
            />
            <path
              d="M12.9229 14.9064C12.9229 15.3004 12.3934 15.6209 11.7427 15.6209C11.0885 15.6209 10.5608 15.3003 10.5608 14.9064C10.5608 14.5107 11.0885 14.1913 11.7427 14.1913C12.3936 14.1916 12.9229 14.5107 12.9229 14.9064Z"
              fill="#004D40"
            />
          </g>
          <defs>
            <clipPath id="clip0_2904_592">
              <rect
                width="20"
                height="20"
                fill="white"
                transform="translate(0 0.5)"
              />
            </clipPath>
          </defs>
        </svg>
      );
  }
};

export default function Icon({ name, className }: IconProps) {
  switch (name) {
    case "arrow-left":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M9.99996 15.8333L4.16663 10M4.16663 10L9.99996 4.16667M4.16663 10H15.8333"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="square"
          />
        </svg>
      );

    case "arrow-right":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M10 4.16667L15.8333 10M15.8333 10L10 15.8333M15.8333 10H4.16663"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="square"
          />
        </svg>
      );

    case "arrow-up-right":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M5.83337 5.83333H14.1667M14.1667 5.83333V14.1667M14.1667 5.83333L5.83337 14.1667"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="square"
          />
        </svg>
      );

    case "award":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M10 1.66667L12.5 5.83333H17.5L13.3333 8.33333L15.8333 12.5L10 10L4.16667 12.5L6.66667 8.33333L2.5 5.83333H7.5L10 1.66667Z"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
            strokeLinejoin="round"
          />
          <path
            d="M10 14.1667V5.83333"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
            strokeLinejoin="round"
          />
        </svg>
      );

    case "badge-info":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M10 1.66667C5.83333 1.66667 2.5 5 2.5 9.16667C2.5 13.3333 5.83333 16.6667 10 16.6667C14.1667 16.6667 17.5 13.3333 17.5 9.16667C17.5 5 14.1667 1.66667 10 1.66667Z"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
            strokeLinejoin="round"
          />
          <path
            d="M10 12.5V10"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
            strokeLinejoin="round"
          />
          <path
            d="M10 7.5H10.0083"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
            strokeLinejoin="round"
          />
        </svg>
      );

    case "binary":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M5 5.83333H15M5 14.1667H15M10 10V5.83333M10 10V14.1667"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
            strokeLinejoin="round"
          />
        </svg>
      );

    case "book-open":
      return <BookOpen className={className} />;

    case "braces":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M6.66667 2.5H5.83333C5.39131 2.5 4.96738 2.67559 4.65482 2.98816C4.34226 3.30072 4.16667 3.72464 4.16667 4.16667V8.33333C4.16667 8.77536 3.99107 9.19928 3.67851 9.51184C3.36595 9.8244 2.94203 10 2.5 10C2.94203 10 3.36595 10.1756 3.67851 10.4882C3.99107 10.8007 4.16667 11.2246 4.16667 11.6667V15.8333C4.16667 16.75 4.91667 17.5 5.83333 17.5H6.66667M13.3333 17.5H14.1667C14.6087 17.5 15.0326 17.3244 15.3452 17.0118C15.6577 16.6993 15.8333 16.2754 15.8333 15.8333V11.6667C15.8333 10.75 16.5833 10 17.5 10C17.058 10 16.634 9.8244 16.3215 9.51184C16.0089 9.19928 15.8333 8.77536 15.8333 8.33333V4.16667C15.8333 3.72464 15.6577 3.30072 15.3452 2.98816C15.0326 2.67559 14.6087 2.5 14.1667 2.5H13.3333"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="square"
          />
        </svg>
      );

    case "build":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M5.00002 18.3333V3.33333C5.00002 2.8913 5.17562 2.46738 5.48818 2.15482C5.80074 1.84226 6.22466 1.66666 6.66669 1.66666H13.3334C13.7754 1.66666 14.1993 1.84226 14.5119 2.15482C14.8244 2.46738 15 2.8913 15 3.33333V18.3333M5.00002 18.3333H15M5.00002 18.3333H3.33335C2.89133 18.3333 2.4674 18.1577 2.15484 17.8452C1.84228 17.5326 1.66669 17.1087 1.66669 16.6667V11.6667C1.66669 11.2246 1.84228 10.8007 2.15484 10.4882C2.4674 10.1756 2.89133 10 3.33335 10H5.00002M15 18.3333L16.6667 18.3333C17.1087 18.3333 17.5326 18.1577 17.8452 17.8452C18.1578 17.5326 18.3334 17.1087 18.3334 16.6667V9.16666C18.3334 8.72464 18.1578 8.30071 17.8452 7.98815C17.5326 7.67559 17.1087 7.5 16.6667 7.5H15M8.33335 5H11.6667M8.33335 8.33333H11.6667M8.33335 11.6667H11.6667M8.33335 15H11.6667"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="square"
          />
        </svg>
      );

    case "calendar":
      return (
        <svg
          width="24"
          height="24"
          xmlns="http://www.w3.org/2000/svg"
          fill="none"
          viewBox="0 0 24 24"
          className={className}
        >
          <path
            fill="currentColor"
            d="M8 5.75c-.41 0-.75-.34-.75-.75V2c0-.41.34-.75.75-.75s.75.34.75.75v3c0 .41-.34.75-.75.75ZM16 5.75c-.41 0-.75-.34-.75-.75V2c0-.41.34-.75.75-.75s.75.34.75.75v3c0 .41-.34.75-.75.75ZM20.5 9.84h-17c-.41 0-.75-.34-.75-.75s.34-.75.75-.75h17c.41 0 .75.34.75.75s-.34.75-.75.75Z"
          />
          <path
            fill="currentColor"
            d="M16 22.75H8c-3.65 0-5.75-2.1-5.75-5.75V8.5c0-3.65 2.1-5.75 5.75-5.75h8c3.65 0 5.75 2.1 5.75 5.75V17c0 3.65-2.1 5.75-5.75 5.75ZM8 4.25c-2.86 0-4.25 1.39-4.25 4.25V17c0 2.86 1.39 4.25 4.25 4.25h8c2.86 0 4.25-1.39 4.25-4.25V8.5c0-2.86-1.39-4.25-4.25-4.25H8Z"
          />
          <path
            fill="currentColor"
            d="M8.5 14.5c-.13 0-.26-.03-.38-.08s-.23-.12-.33-.21c-.09-.1-.16-.21-.21-.33a.995.995 0 0 1-.08-.38c0-.26.11-.52.29-.71.1-.09.21-.16.33-.21.18-.08.38-.1.58-.06.06.01.12.03.18.06.06.02.12.05.18.09l.15.12c.04.05.09.1.12.15.04.06.07.12.09.18.03.06.05.12.06.18.01.07.02.13.02.2 0 .26-.11.52-.29.71-.19.18-.45.29-.71.29ZM12 14.5c-.26 0-.52-.11-.71-.29l-.12-.15a.757.757 0 0 1-.09-.18.636.636 0 0 1-.06-.18c-.01-.07-.02-.13-.02-.2 0-.13.03-.26.08-.38s.12-.23.21-.33c.28-.28.73-.37 1.09-.21.13.05.23.12.33.21.18.19.29.45.29.71 0 .07-.01.13-.02.2-.01.06-.03.12-.06.18-.02.06-.05.12-.09.18l-.12.15c-.1.09-.2.16-.33.21-.12.05-.25.08-.38.08ZM8.5 18c-.13 0-.26-.03-.38-.08s-.23-.12-.33-.21c-.09-.1-.16-.2-.21-.33A.995.995 0 0 1 7.5 17c0-.26.11-.52.29-.71.1-.09.21-.16.33-.21.37-.16.81-.07 1.09.21.04.05.09.1.12.15.04.06.07.12.09.18.03.06.05.12.06.19.01.06.02.13.02.19 0 .26-.11.52-.29.71-.19.18-.45.29-.71.29Z"
          />
        </svg>
      );

    case "check":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M16.6667 5L7.50004 14.1667L3.33337 10"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
          />
        </svg>
      );

    case "chevron-down":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M5 7.5L10 12.5L15 7.5"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="square"
          />
        </svg>
      );

    case "chevron-right":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M7.5 5L12.5 10L7.5 15"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="square"
          />
        </svg>
      );

    case "chevron-up":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M5 12.5L10 7.5L15 12.5"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="square"
          />
        </svg>
      );

    case "close":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          className={className}
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            d="M5 5L15 15M5 15L15 5"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
          />
        </svg>
      );

    case "codemod-studio":
      return (
        <svg
          width="24"
          height="24"
          viewBox="0 0 24 24"
          fill="none"
          className={className}
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            fill="currentColor"
            d="M2 19.74 8.044 4h2.015L3.993 19.74H2ZM13.998 8.773c2.636 0 4.479 1.526 4.844 3.903h-2.015c-.343-1.352-1.415-2.072-2.765-2.072-1.907 0-3.215 1.482-3.215 3.794 0 2.31 1.222 3.771 3.13 3.771 1.436 0 2.508-.763 2.872-2.028h2.014C18.456 18.452 16.506 20 13.977 20c-3.087 0-5.123-2.224-5.123-5.581S10.934 8.773 14 8.773h-.002ZM19.935 18.474c0-.85.707-1.548 1.543-1.548S23 17.624 23 18.474c0 .85-.707 1.526-1.522 1.526-.815 0-1.543-.698-1.543-1.526Z"
          />
        </svg>
      );

    case "codemod-brand":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
        >
          <rect width="20" height="20" rx="4.26667" fill="#D6FF62" />
          <mask
            id="mask0_3269_819"
            style={{
              maskType: "luminance",
            }}
            maskUnits="userSpaceOnUse"
            x="3"
            y="3"
            width="15"
            height="12"
          >
            <path
              d="M17.2001 3.91504H3.00024V14.512H17.2001V3.91504Z"
              fill="white"
            />
          </mask>
          <g mask="url(#mask0_3269_819)">
            <path
              d="M3.00024 14.3389L7.07143 3.91504H8.42849L4.34301 14.3389H3.00024Z"
              fill="#0B151E"
            />
            <path
              d="M11.0815 7.07682C12.8573 7.07682 14.0989 8.08738 14.3445 9.66114H12.9875C12.7565 8.76611 12.0345 8.28941 11.1251 8.28941C9.84033 8.28941 8.95957 9.27098 8.95957 10.8015C8.95957 12.332 9.78236 13.2993 11.0676 13.2993C12.0349 13.2993 12.7569 12.794 13.0022 11.9565H14.3592C14.085 13.487 12.7712 14.5119 11.0676 14.5119C8.98853 14.5119 7.61719 13.0393 7.61719 10.8158C7.61719 8.59225 9.01752 7.07642 11.0823 7.07642L11.0815 7.07682Z"
              fill="#0B151E"
            />
            <path
              d="M15.0807 13.5013C15.0807 12.9381 15.557 12.4761 16.1202 12.4761C16.6834 12.4761 17.1455 12.9381 17.1455 13.5013C17.1455 14.0645 16.6691 14.5119 16.1202 14.5119C15.5713 14.5119 15.0807 14.0499 15.0807 13.5013Z"
              fill="#0B151E"
            />
          </g>
        </svg>
      );

    case "codemod-dot-pulse":
      return (
        <svg
          id="lul85hax16262661"
          viewBox="0 0 600 600"
          xmlns="http://www.w3.org/2000/svg"
          xmlnsXlink="http://www.w3.org/1999/xlink"
          className={className}
        >
          <g id="lul85hax16262661_translate">
            <g transform="matrix(1,0,0,1,0,0)">
              <g
                id="lul85hax16262661"
                opacity="1"
                style={{ mixBlendMode: "normal" }}
              >
                <g>
                  <defs>
                    <clipPath
                      id="lul85hax16262661_clipPath"
                      x="-50%"
                      y="-50%"
                      width="200%"
                      height="200%"
                    >
                      <path
                        d="M0.01,0h599.98c0.00552,0 0.01,0.00448 0.01,0.01v599.98c0,0.00552 -0.00448,0.01 -0.01,0.01h-599.98c-0.00552,0 -0.01,-0.00448 -0.01,-0.01v-599.98c0,-0.00552 0.00448,-0.01 0.01,-0.01z"
                        fill="white"
                        clipRule="nonzero"
                      />
                    </clipPath>
                  </defs>
                  <g clipPath="url(#lul85hax16262661_clipPath)">
                    <g id="lul85hb590925487_translate">
                      <g transform="matrix(1,0,0,1,90.0044,117.4508)">
                        <g
                          id="lul85hb590925487"
                          opacity="1"
                          style={{ mixBlendMode: "normal" }}
                        >
                          <g>
                            <g>
                              <path
                                id="lul85hb590925487_fill_path"
                                d="M0,312.715l122.13561,-312.715h40.7117l-122.56425,312.715z"
                                fillRule="nonzero"
                                fill="rgb(11, 21, 30)"
                                fillOpacity="0.15"
                                style={{ mixBlendMode: "normal" }}
                              />
                            </g>
                          </g>
                        </g>
                      </g>
                    </g>
                    <g id="lul85hb856377086_translate">
                      <g transform="matrix(1,0,0,1,228.5157,212.2931)">
                        <g
                          id="lul85hb856377086"
                          opacity="1"
                          style={{ mixBlendMode: "normal" }}
                        >
                          <g>
                            <g>
                              <path
                                id="lul85hb856377086_fill_path"
                                d="M103.92855,0.01219c53.27432,0 90.52136,30.31667 97.89204,77.52956h-40.7117c-6.93037,-26.85095 -28.58991,-41.152 -55.87004,-41.152c-38.54463,0 -64.96745,29.44719 -64.96745,75.36249c0,45.9153 24.68388,74.93386 63.2407,74.93386c29.01855,0 50.6786,-15.1578 58.03708,-40.28304h40.7117c-8.22796,45.9153 -47.64153,76.66061 -98.74878,76.66061c-62.37175,0 -103.5121,-44.17688 -103.5121,-110.88276c0,-66.70589 42.00982,-112.1809 103.9524,-112.1809z"
                                fillRule="nonzero"
                                fill="rgb(11, 21, 30)"
                                fillOpacity="0.15"
                                style={{ mixBlendMode: "normal" }}
                              />
                            </g>
                          </g>
                        </g>
                      </g>
                    </g>
                    <g id="lul85hba33866020_translate">
                      <g transform="matrix(1,0,0,1,452.421,374.2844)">
                        <g
                          id="lul85hba33866020"
                          opacity="1"
                          style={{ mixBlendMode: "normal" }}
                        >
                          <g>
                            <g>
                              <path
                                id="lul85hba33866020_fill_path"
                                d="M0,30.75697c0,-16.89675 14.28887,-30.75697 31.18563,-30.75697c16.89675,0 30.7596,13.86022 30.7596,30.75697c0,16.89675 -14.29149,30.31667 -30.7596,30.31667c-16.46811,0 -31.18563,-13.86022 -31.18563,-30.31667z"
                                fillRule="nonzero"
                                fill="rgb(11, 21, 30)"
                                fillOpacity="0.15"
                                style={{ mixBlendMode: "normal" }}
                              />
                            </g>
                          </g>
                        </g>
                      </g>
                    </g>
                  </g>
                </g>
              </g>
            </g>
          </g>
          <animate
            href="#lul85hba33866020"
            attributeName="opacity"
            values="1;0;0;1;1;1"
            dur="1.4s"
            repeatCount="indefinite"
            calcMode="spline"
            keyTimes="0;0.21;0.36;0.57;0.57;1"
            keySplines="0.5 0.35 0.15 1;0.5 0.35 0.15 1;0.5 0.35 0.15 1;0.5 0.35 0.15 1;0.5 0.35 0.15 1"
            additive="replace"
            fill="freeze"
          />
        </svg>
      );
    case "command":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M12.5 5V15C12.5 15.4945 12.6466 15.9778 12.9213 16.3889C13.196 16.8 13.5865 17.1205 14.0433 17.3097C14.5001 17.4989 15.0028 17.5484 15.4877 17.452C15.9727 17.3555 16.4181 17.1174 16.7678 16.7678C17.1174 16.4181 17.3555 15.9727 17.452 15.4877C17.5484 15.0028 17.4989 14.5001 17.3097 14.0433C17.1205 13.5865 16.8 13.196 16.3889 12.9213C15.9778 12.6466 15.4945 12.5 15 12.5H5C4.50555 12.5 4.0222 12.6466 3.61108 12.9213C3.19995 13.196 2.87952 13.5865 2.6903 14.0433C2.50108 14.5001 2.45157 15.0028 2.54804 15.4877C2.6445 15.9727 2.8826 16.4181 3.23223 16.7678C3.58187 17.1174 4.02732 17.3555 4.51228 17.452C4.99723 17.5484 5.49989 17.4989 5.95671 17.3097C6.41352 17.1205 6.80397 16.8 7.07867 16.3889C7.35338 15.9778 7.5 15.4945 7.5 15V5C7.5 4.50555 7.35338 4.0222 7.07867 3.61107C6.80397 3.19995 6.41352 2.87952 5.95671 2.6903C5.49989 2.50108 4.99723 2.45157 4.51228 2.54804C4.02732 2.6445 3.58187 2.8826 3.23223 3.23223C2.8826 3.58186 2.6445 4.02732 2.54804 4.51227C2.45157 4.99723 2.50108 5.49989 2.6903 5.95671C2.87952 6.41352 3.19995 6.80397 3.61108 7.07867C4.0222 7.35338 4.50555 7.5 5 7.5H15C15.4945 7.5 15.9778 7.35338 16.3889 7.07867C16.8 6.80397 17.1205 6.41352 17.3097 5.95671C17.4989 5.49989 17.5484 4.99723 17.452 4.51227C17.3555 4.02732 17.1174 3.58186 16.7678 3.23223C16.4181 2.8826 15.9727 2.6445 15.4877 2.54804C15.0028 2.45157 14.5001 2.50108 14.0433 2.6903C13.5865 2.87952 13.196 3.19995 12.9213 3.61107C12.6466 4.0222 12.5 4.50555 12.5 5Z"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="square"
          />
        </svg>
      );

    case "copy":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M3.33329 13.3333C2.41663 13.3333 1.66663 12.5833 1.66663 11.6667V3.33333C1.66663 2.41667 2.41663 1.66667 3.33329 1.66667H11.6666C12.5833 1.66667 13.3333 2.41667 13.3333 3.33333M8.33329 6.66667H16.6666C17.5871 6.66667 18.3333 7.41286 18.3333 8.33333V16.6667C18.3333 17.5871 17.5871 18.3333 16.6666 18.3333H8.33329C7.41282 18.3333 6.66663 17.5871 6.66663 16.6667V8.33333C6.66663 7.41286 7.41282 6.66667 8.33329 6.66667Z"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
          />
        </svg>
      );

    case "drafting":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            d="M2.5 17.5L9.18333 5.61667M10.825 5.61667L12.4333 8.48333M15.8333 10C12.6083 13.3333 7.39167 13.3333 4.16667 10M17.5 17.5L15.7 14.3M11.6667 4.16667C11.6667 5.08714 10.9205 5.83333 10 5.83333C9.07952 5.83333 8.33333 5.08714 8.33333 4.16667C8.33333 3.24619 9.07952 2.5 10 2.5C10.9205 2.5 11.6667 3.24619 11.6667 4.16667Z"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
            strokeLinejoin="round"
          />
        </svg>
      );

    case "file-json-2":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M3.33335 18.3333H15C15.442 18.3333 15.866 18.1577 16.1785 17.8452C16.4911 17.5326 16.6667 17.1087 16.6667 16.6667V5.83333L12.5 1.66667H5.00002C4.55799 1.66667 4.13407 1.84226 3.82151 2.15482C3.50895 2.46738 3.33335 2.89131 3.33335 3.33333V6.66667M11.6667 1.66667V5C11.6667 5.44203 11.8423 5.86595 12.1548 6.17851C12.4674 6.49107 12.8913 6.66667 13.3334 6.66667H16.6667M3.33335 10C3.11234 10 2.90038 10.0878 2.7441 10.2441C2.58782 10.4004 2.50002 10.6123 2.50002 10.8333V11.6667C2.50002 11.8877 2.41222 12.0996 2.25594 12.2559C2.09966 12.4122 1.8877 12.5 1.66669 12.5C1.8877 12.5 2.09966 12.5878 2.25594 12.7441C2.41222 12.9004 2.50002 13.1123 2.50002 13.3333V14.1667C2.50002 14.3877 2.58782 14.5996 2.7441 14.7559C2.90038 14.9122 3.11234 15 3.33335 15M6.66669 15C6.8877 15 7.09966 14.9122 7.25594 14.7559C7.41222 14.5996 7.50002 14.3877 7.50002 14.1667V13.3333C7.50002 13.1123 7.58782 12.9004 7.7441 12.7441C7.90038 12.5878 8.11234 12.5 8.33335 12.5C8.11234 12.5 7.90038 12.4122 7.7441 12.2559C7.58782 12.0996 7.50002 11.8877 7.50002 11.6667V10.8333C7.50002 10.6123 7.41222 10.4004 7.25594 10.2441C7.09966 10.0878 6.8877 10 6.66669 10"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
          />
        </svg>
      );

    case "file":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            d="M12.5 1.66666H5.00004C4.55801 1.66666 4.13409 1.84226 3.82153 2.15482C3.50897 2.46738 3.33337 2.8913 3.33337 3.33333V16.6667C3.33337 17.1087 3.50897 17.5326 3.82153 17.8452C4.13409 18.1577 4.55801 18.3333 5.00004 18.3333H15C15.4421 18.3333 15.866 18.1577 16.1786 17.8452C16.4911 17.5326 16.6667 17.1087 16.6667 16.6667V5.83333L12.5 1.66666Z"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
            strokeLinejoin="round"
          />
          <path
            d="M11.6666 1.66666V5C11.6666 5.44202 11.8422 5.86595 12.1548 6.17851C12.4673 6.49107 12.8913 6.66666 13.3333 6.66666H16.6666"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
            strokeLinejoin="round"
          />
        </svg>
      );

    case "filter":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M18.3333 2.5H1.66663L8.33329 10.3833V15.8333L11.6666 17.5V10.3833L18.3333 2.5Z"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
          />
        </svg>
      );

    case "group":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M15 17.4999C15 15.7318 14.2976 14.0361 13.0473 12.7859C11.7971 11.5356 10.1014 10.8332 8.33329 10.8332C6.56518 10.8332 4.86949 11.5356 3.61925 12.7859C2.36901 14.0361 1.66663 15.7318 1.66663 17.4999"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
          />
          <path
            d="M8.33329 10.8332C10.6345 10.8332 12.5 8.96775 12.5 6.66656C12.5 4.36538 10.6345 2.4999 8.33329 2.4999C6.03211 2.4999 4.16663 4.36538 4.16663 6.66656C4.16663 8.96775 6.03211 10.8332 8.33329 10.8332Z"
            stroke="currentColor"
            strokeWidth="1.2"
          />
          <path
            d="M18.3333 16.6665C18.3333 13.8582 16.6667 11.2499 15 9.99986C15.5478 9.58883 15.9859 9.0491 16.2755 8.42841C16.565 7.80773 16.6971 7.12525 16.66 6.44136C16.6229 5.75747 16.4178 5.09326 16.0629 4.50752C15.7079 3.92179 15.2141 3.43258 14.625 3.08319"
            stroke="currentColor"
            strokeLinecap="round"
          />
        </svg>
      );

    case "home":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M2.5 7.5L10 1.66666L17.5 7.5V16.6667C17.5 17.1087 17.3244 17.5326 17.0118 17.8452C16.6993 18.1577 16.2754 18.3333 15.8333 18.3333H4.16667C3.72464 18.3333 3.30072 18.1577 2.98816 17.8452C2.67559 17.5326 2.5 17.1087 2.5 16.6667V7.5Z"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
            strokeLinejoin="round"
          />
          <path
            d="M7.5 18.3333V10H12.5V18.3333"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
            strokeLinejoin="round"
          />
        </svg>
      );

    case "layers-2":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M13.35 10L17.9167 12.6083C18.0449 12.681 18.1516 12.7864 18.2258 12.9138C18.3 13.0411 18.3391 13.1859 18.3391 13.3333C18.3391 13.4807 18.3 13.6255 18.2258 13.7529C18.1516 13.8803 18.0449 13.9857 17.9167 14.0583L10.8333 18.1167C10.58 18.2629 10.2926 18.34 10 18.34C9.70745 18.34 9.42004 18.2629 9.16668 18.1167L2.08335 14.0583C1.9551 13.9857 1.84842 13.8803 1.77421 13.7529C1.69999 13.6255 1.66089 13.4807 1.66089 13.3333C1.66089 13.1859 1.69999 13.0411 1.77421 12.9138C1.84842 12.7864 1.9551 12.681 2.08335 12.6083L6.65001 10M10.8333 11.45C10.58 11.5963 10.2926 11.6733 10 11.6733C9.70745 11.6733 9.42004 11.5963 9.16668 11.45L2.08335 7.39167C1.9551 7.31898 1.84842 7.21358 1.77421 7.08622C1.69999 6.95885 1.66089 6.81408 1.66089 6.66667C1.66089 6.51925 1.69999 6.37448 1.77421 6.24711C1.84842 6.11975 1.9551 6.01435 2.08335 5.94167L9.16668 1.88333C9.42004 1.73705 9.70745 1.66004 10 1.66004C10.2926 1.66004 10.58 1.73705 10.8333 1.88333L17.9167 5.94167C18.0449 6.01435 18.1516 6.11975 18.2258 6.24711C18.3 6.37448 18.3391 6.51925 18.3391 6.66667C18.3391 6.81408 18.3 6.95885 18.2258 7.08622C18.1516 7.21358 18.0449 7.31898 17.9167 7.39167L10.8333 11.45Z"
            stroke="currentColor"
            strokeWidth="1.2"
          />
        </svg>
      );
    case "loading":
      return (
        <svg
          xmlns="http://www.w3.org/2000/svg"
          width="18"
          height="18"
          viewBox="0 0 18 18"
          fill="none"
          className={className}
        >
          <path
            d="M16.5 9C16.5 10.4834 16.0601 11.9334 15.236 13.1668C14.4119 14.4001 13.2406 15.3614 11.8701 15.9291C10.4997 16.4968 8.99168 16.6453 7.53683 16.3559C6.08197 16.0665 4.7456 15.3522 3.6967 14.3033C2.64781 13.2544 1.9335 11.918 1.64411 10.4632C1.35472 9.00832 1.50325 7.50032 2.07091 6.12987C2.63856 4.75943 3.59986 3.58809 4.83323 2.76398C6.0666 1.93987 7.51664 1.5 9 1.5"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="square"
          />
        </svg>
      );
    case "location":
      return (
        <svg
          width="32"
          height="32"
          viewBox="0 0 32 32"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <g id="Frame">
            <path
              id="Vector"
              d="M26.6663 13.3334C26.6663 21.3334 15.9997 29.3334 15.9997 29.3334C15.9997 29.3334 5.33301 21.3334 5.33301 13.3334C5.33301 10.5044 6.45681 7.79133 8.4572 5.79094C10.4576 3.79055 13.1707 2.66675 15.9997 2.66675C18.8286 2.66675 21.5418 3.79055 23.5421 5.79094C25.5425 7.79133 26.6663 10.5044 26.6663 13.3334Z"
              stroke="currentColor"
              strokeOpacity="0.6"
              strokeWidth="1.92"
              strokeLinecap="round"
              strokeLinejoin="round"
            />
            <path
              id="Vector_2"
              d="M15.9998 17.3331C18.2089 17.3331 19.9998 15.5423 19.9998 13.3331C19.9998 11.124 18.2089 9.33313 15.9998 9.33313C13.7906 9.33313 11.9998 11.124 11.9998 13.3331C11.9998 15.5423 13.7906 17.3331 15.9998 17.3331Z"
              stroke="currentColor"
              strokeOpacity="0.6"
              strokeWidth="1.92"
              strokeLinecap="round"
              strokeLinejoin="round"
            />
          </g>
        </svg>
      );

    case "mail":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M18.3334 5.83333L10.8584 10.5833C10.6011 10.7445 10.3036 10.83 10 10.83C9.69642 10.83 9.39896 10.7445 9.14169 10.5833L1.66669 5.83333M3.33335 3.33333H16.6667C17.5872 3.33333 18.3334 4.07953 18.3334 5V15C18.3334 15.9205 17.5872 16.6667 16.6667 16.6667H3.33335C2.41288 16.6667 1.66669 15.9205 1.66669 15V5C1.66669 4.07953 2.41288 3.33333 3.33335 3.33333Z"
            stroke="currentColor"
            strokeWidth="1.2"
          />
        </svg>
      );

    case "medal":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M6.00838 12.5L2.21671 5.95C2.05321 5.6674 1.97632 5.34299 1.99558 5.01707C2.01484 4.69114 2.1294 4.37805 2.32504 4.11667L3.66671 2.33333C3.82196 2.12634 4.02326 1.95834 4.25469 1.84262C4.48611 1.72691 4.7413 1.66667 5.00005 1.66667H15C15.2588 1.66667 15.514 1.72691 15.7454 1.84262C15.9768 1.95834 16.1781 2.12634 16.3334 2.33333L17.6667 4.11667C17.8636 4.37721 17.9797 4.68987 18.0004 5.01581C18.0212 5.34175 17.9457 5.6666 17.7834 5.95L13.9917 12.5M9.16671 10L4.26671 1.83333M10.8334 10L15.7334 1.83333M6.66671 5.83333H13.3334M14.1667 14.1667C14.1667 16.4679 12.3012 18.3333 10 18.3333C7.69886 18.3333 5.83338 16.4679 5.83338 14.1667C5.83338 11.8655 7.69886 10 10 10C12.3012 10 14.1667 11.8655 14.1667 14.1667Z"
            stroke="currentColor"
            strokeWidth="1.2"
          />
        </svg>
      );

    case "moon":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M14.5281 12.9752C11.0371 12.9752 8.21739 10.2174 8.21739 6.82609C8.21739 4.86957 9.15729 3.11801 10.6343 2C6.41432 2.0559 3 5.3913 3 9.49068C3 13.6273 6.45269 17 10.711 17C14.087 17 16.9642 14.8758 18 11.9503C17.0026 12.6025 15.8133 12.9752 14.5281 12.9752Z"
            fill="currentColor"
          />
        </svg>
      );

    case "panel-right-close":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M12.5 2.5V17.5M6.66667 7.5L9.16667 10L6.66667 12.5M4.16667 2.5H15.8333C16.7538 2.5 17.5 3.24619 17.5 4.16667V15.8333C17.5 16.7538 16.7538 17.5 15.8333 17.5H4.16667C3.24619 17.5 2.5 16.7538 2.5 15.8333V4.16667C2.5 3.24619 3.24619 2.5 4.16667 2.5Z"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
          />
        </svg>
      );

    case "panel-right-open":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M12.5 2.5V17.5M8.33333 12.5L5.83333 10L8.33333 7.5M4.16667 2.5H15.8333C16.7538 2.5 17.5 3.24619 17.5 4.16667V15.8333C17.5 16.7538 16.7538 17.5 15.8333 17.5H4.16667C3.24619 17.5 2.5 16.7538 2.5 15.8333V4.16667C2.5 3.24619 3.24619 2.5 4.16667 2.5Z"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
          />
        </svg>
      );

    case "pause":
      return (
        <svg
          className={className}
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
        >
          <g id="pause">
            <path
              id="Vector"
              d="M8.33333 3.33333H5V16.6667H8.33333V3.33333Z"
              stroke="currentColor"
              strokeWidth="1.2"
              strokeLinecap="round"
              strokeLinejoin="round"
            />
            <path
              id="Vector_2"
              d="M15 3.33333H11.6666V16.6667H15V3.33333Z"
              stroke="currentColor"
              strokeWidth="1.2"
              strokeLinecap="round"
              strokeLinejoin="round"
            />
          </g>
        </svg>
      );

    case "play":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={cx(className, "translate-x-px")}
        >
          <path
            fillRule="evenodd"
            clipRule="evenodd"
            d="M3.56665 1.401L16.9429 10L3.56665 18.599V1.401ZM4.76665 3.599V16.401L14.7238 10L4.76665 3.599Z"
            fill="currentColor"
          />
        </svg>
      );

    case "refresh":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            fillRule="evenodd"
            clipRule="evenodd"
            d="M10 3.1C8.63534 3.1 7.30129 3.50468 6.16659 4.26286C5.03189 5.02104 4.1475 6.09867 3.62526 7.35948C3.10301 8.62029 2.96637 10.0077 3.23261 11.3461C3.49885 12.6846 4.15601 13.9141 5.12099 14.879C6.08597 15.844 7.31544 16.5012 8.65391 16.7674C9.99237 17.0337 11.3797 16.897 12.6405 16.3748C13.9014 15.8525 14.979 14.9681 15.7372 13.8334C16.4953 12.6987 16.9 11.3647 16.9 10V9.4H18.1V10C18.1 11.602 17.625 13.1681 16.7349 14.5001C15.8449 15.8322 14.5798 16.8704 13.0998 17.4834C11.6197 18.0965 9.99104 18.2569 8.4198 17.9444C6.84855 17.6318 5.40527 16.8604 4.27246 15.7276C3.13966 14.5948 2.36821 13.1515 2.05567 11.5802C1.74313 10.009 1.90353 8.38034 2.5166 6.90026C3.12967 5.42018 4.16787 4.15514 5.49991 3.2651C6.83195 2.37506 8.398 1.9 10 1.9C12.2595 1.9 14.4157 2.79646 16.0325 4.35079L16.041 4.35899L16.9 5.21814V1.9H18.1V7.26667H12.7334V6.06667H16.0515L15.1967 5.21188C13.7974 3.86868 11.9386 3.1 10 3.1Z"
            fill="currentColor"
          />
        </svg>
      );

    case "search":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M17.5 17.5L13.9167 13.9167M15.8333 9.16667C15.8333 12.8486 12.8486 15.8333 9.16667 15.8333C5.48477 15.8333 2.5 12.8486 2.5 9.16667C2.5 5.48477 5.48477 2.5 9.16667 2.5C12.8486 2.5 15.8333 5.48477 15.8333 9.16667Z"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
          />
        </svg>
      );

    case "search-x":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <g id="search-x">
            <path
              id="Vector"
              d="M11.25 7.08333L7.08333 11.25M7.08333 7.08333L11.25 11.25M17.5 17.5L13.9167 13.9167M15.8333 9.16667C15.8333 12.8486 12.8486 15.8333 9.16667 15.8333C5.48477 15.8333 2.5 12.8486 2.5 9.16667C2.5 5.48477 5.48477 2.5 9.16667 2.5C12.8486 2.5 15.8333 5.48477 15.8333 9.16667Z"
              stroke="currentColor"
              strokeOpacity="0.4"
              strokeWidth="1.2"
              strokeLinecap="round"
              strokeLinejoin="round"
            />
          </g>
        </svg>
      );

    case "shield-check-solid":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            fillRule="evenodd"
            clipRule="evenodd"
            d="M16.6667 10C16.6667 15 10 18.3333 10 18.3333C10 18.3333 3.33337 15 3.33337 10V4.16667L10 1.66667L16.6667 4.16667V10ZM12.9243 8.75761L13.3485 8.33334L12.5 7.48482L12.0757 7.90908L9.16667 10.8181L7.92426 9.57575L7.5 9.15148L6.65147 10L7.07574 10.4243L8.7424 12.0909L9.16667 12.5152L9.59093 12.0909L12.9243 8.75761Z"
            fill="currentColor"
          />
        </svg>
      );

    case "shield-check":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M7.49998 10L9.16665 11.6667L12.5 8.33333M9.99998 18.3333C9.99998 18.3333 16.6666 15 16.6666 10V4.16667L9.99998 1.66667L3.33331 4.16667V10C3.33331 15 9.99998 18.3333 9.99998 18.3333Z"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
          />
        </svg>
      );

    case "slack":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            fillRule="evenodd"
            clipRule="evenodd"
            d="M6.21662 3.68155C6.21662 4.6115 6.96822 5.3631 7.89817 5.3631H9.57973V3.68155C9.57973 2.7516 8.82812 2 7.89817 2C6.96822 2 6.21662 2.7516 6.21662 3.68155ZM9.57973 7.89817C9.57973 6.96822 8.82812 6.21662 7.89817 6.21662H3.68155C2.7516 6.21662 2 6.96822 2 7.89817C2 8.82812 2.7516 9.57973 3.68155 9.57973H7.89817C8.82812 9.57973 9.57973 8.82812 9.57973 7.89817ZM3.69388 13.7954C4.62383 13.7954 5.37543 13.0438 5.37543 12.1138V10.4323H3.69388C2.76393 10.4323 2.01233 11.1839 2.01233 12.1138C2.01233 13.0438 2.76393 13.7954 3.69388 13.7954ZM7.89776 10.4323C6.96781 10.4323 6.21621 11.1839 6.21621 12.1138V16.3177C6.21621 17.2477 6.96781 17.9993 7.89776 17.9993C8.82771 17.9993 9.57932 17.2477 9.57932 16.3177V12.1138C9.57932 11.1839 8.82771 10.4323 7.89776 10.4323ZM14.6375 7.89817C14.6375 6.96822 15.3891 6.21662 16.319 6.21662C17.249 6.21662 18.0006 6.96822 18.0006 7.89817C18.0006 8.82812 17.249 9.57973 16.319 9.57973H14.6375V7.89817ZM13.7967 7.89817C13.7967 8.82812 13.0451 9.57973 12.1151 9.57973C11.1852 9.57973 10.4336 8.82812 10.4336 7.89817V3.68155C10.4336 2.7516 11.1852 2 12.1151 2C13.0451 2 13.7967 2.7516 13.7967 3.68155V7.89817ZM13.7967 16.3177C13.7967 15.3878 13.0451 14.6362 12.1151 14.6362H10.4336V16.3177C10.4336 17.2477 11.1852 17.9993 12.1151 17.9993C13.0451 17.9993 13.7967 17.2477 13.7967 16.3177ZM10.4336 12.1138C10.4336 13.0438 11.1852 13.7954 12.1151 13.7954H16.3318C17.2617 13.7954 18.0133 13.0438 18.0133 12.1138C18.0133 11.1839 17.2617 10.4323 16.3318 10.4323H12.1151C11.1852 10.4323 10.4336 11.1839 10.4336 12.1138Z"
            fill="currentColor"
          />
        </svg>
      );

    case "star":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M9.9999 2.43935L12.3238 7.14739L17.5207 7.907L13.7603 11.5696L14.6478 16.744L9.9999 14.2997L5.35202 16.744L6.23948 11.5696L2.47906 7.907L7.67596 7.14739L9.9999 2.43935Z"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
          />
        </svg>
      );

    case "sun":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            fillRule="evenodd"
            clipRule="evenodd"
            d="M10.5343 16.9657V15.3036C10.5343 15.0087 10.2949 14.7694 10 14.7694C9.70509 14.7694 9.46574 15.0087 9.46574 15.3036V16.9657C9.46574 17.2607 9.70509 17.5 10 17.5C10.2949 17.5 10.5343 17.2607 10.5343 16.9657ZM13.3728 14.1283L14.5477 15.3031C14.7566 15.512 15.0947 15.512 15.3036 15.3031C15.512 15.0947 15.512 14.756 15.3036 14.5477L14.1283 13.3723C13.9199 13.1639 13.5812 13.1639 13.3728 13.3723C13.1639 13.5812 13.1639 13.9194 13.3728 14.1283ZM5.45234 15.3031L6.62772 14.1283C6.83609 13.9194 6.83609 13.5812 6.62772 13.3723C6.41936 13.1639 6.08064 13.1639 5.87228 13.3723L4.69689 14.5477C4.48853 14.756 4.48853 15.0947 4.69689 15.3031C4.90526 15.512 5.24398 15.512 5.45234 15.3031ZM9.98611 6.28045C7.90568 6.28045 6.21634 7.9698 6.21634 10.0508C6.21634 12.1312 7.90568 13.8205 9.98611 13.8205C12.0671 13.8205 13.7564 12.1312 13.7564 10.0508C13.7564 7.9698 12.0671 6.28045 9.98611 6.28045ZM15.3036 10.5343H16.9657C17.2606 10.5343 17.5 10.2949 17.5 10C17.5 9.70509 17.2606 9.46574 16.9657 9.46574H15.3036C15.0087 9.46574 14.7694 9.70509 14.7694 10C14.7694 10.2949 15.0087 10.5343 15.3036 10.5343ZM3.03426 10.5343H4.69636C4.99127 10.5343 5.23062 10.2949 5.23062 10C5.23062 9.70509 4.99127 9.46574 4.69636 9.46574H3.03426C2.73935 9.46574 2.5 9.70509 2.5 10C2.5 10.2949 2.73935 10.5343 3.03426 10.5343ZM4.69689 5.45234L5.87228 6.62772C6.08064 6.83609 6.41936 6.83609 6.62772 6.62772C6.83609 6.41883 6.83609 6.08064 6.62772 5.87174L5.45234 4.69689C5.24398 4.488 4.90526 4.488 4.69689 4.69689C4.48853 4.90526 4.48853 5.24398 4.69689 5.45234ZM14.1283 6.62772L15.3036 5.45234C15.512 5.24398 15.512 4.90526 15.3036 4.69689C15.0947 4.488 14.7566 4.488 14.5477 4.69689L13.3728 5.87174C13.1639 6.08064 13.1639 6.41883 13.3728 6.62772C13.5812 6.83609 13.9199 6.83609 14.1283 6.62772ZM10.5343 4.69636V3.03426C10.5343 2.73935 10.2949 2.5 10 2.5C9.70509 2.5 9.46574 2.73935 9.46574 3.03426V4.69636C9.46574 4.99127 9.70509 5.23062 10 5.23062C10.2949 5.23062 10.5343 4.99127 10.5343 4.69636Z"
            fill="currentColor"
          />
        </svg>
      );

    case "terminal":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M3.33337 14.1667L8.33337 9.16666L3.33337 4.16666"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
            strokeLinejoin="round"
          />
          <path
            d="M10 15.8333H16.6667"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
            strokeLinejoin="round"
          />
        </svg>
      );
    case "tip":
      return (
        <svg
          width={20}
          height={21}
          viewBox="0 0 20 21"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <g
            stroke="currentColor"
            strokeWidth={1.5}
            strokeLinecap="round"
            strokeLinejoin="round"
          >
            <path d="M12 11.646c.133-.667.467-1.133 1-1.667.667-.6 1-1.466 1-2.333a4 4 0 10-8 0c0 .667.133 1.467 1 2.333.467.467.867 1 1 1.667M8 14.313h4M8.667 16.98h2.667" />
          </g>
        </svg>
      );

    case "type":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            d="M3.33331 5.83334V3.33334H16.6666V5.83334"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
            strokeLinejoin="round"
          />
          <path
            d="M7.5 16.6667H12.5"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
            strokeLinejoin="round"
          />
          <path
            d="M10 3.33334V16.6667"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
            strokeLinejoin="round"
          />
        </svg>
      );

    case "user":
      return (
        <svg
          width="20"
          height="20"
          viewBox="0 0 20 20"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className={className}
        >
          <path
            d="M10 10.8332C12.3012 10.8332 14.1667 8.96775 14.1667 6.66656C14.1667 4.36538 12.3012 2.4999 10 2.4999C7.69885 2.4999 5.83337 4.36538 5.83337 6.66656C5.83337 8.96775 7.69885 10.8332 10 10.8332Z"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
          />
          <path
            d="M16.6667 17.4999C16.6667 15.7318 15.9643 14.0361 14.7141 12.7859C13.4638 11.5356 11.7682 10.8332 10 10.8332C8.23193 10.8332 6.53624 11.5356 5.286 12.7859C4.03575 14.0361 3.33337 15.7318 3.33337 17.4999"
            stroke="currentColor"
            strokeWidth="1.2"
            strokeLinecap="round"
          />
        </svg>
      );

    case "vscode":
      return (
        <svg
          width="24"
          height="24"
          viewBox="0 0 24 24"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            d="M0 4C0 1.79086 1.79086 0 4 0H20C22.2091 0 24 1.79086 24 4V20C24 22.2091 22.2091 24 20 24H4C1.79086 24 0 22.2091 0 20V4Z"
            fill="none"
          />
          <path
            d="M0.25 4C0.25 1.92893 1.92893 0.25 4 0.25H20C22.0711 0.25 23.75 1.92893 23.75 4V20C23.75 22.0711 22.0711 23.75 20 23.75H4C1.92893 23.75 0.25 22.0711 0.25 20V4Z"
            stroke="currentColor"
            strokeOpacity="0.1"
            strokeWidth="0.5"
          />
          <path
            d="M14.863 17.9201C14.7118 17.9931 14.5415 18.0171 14.376 17.9886C14.2105 17.9601 14.0581 17.8805 13.94 17.7611L8.81602 13.0631L6.58402 14.7661C6.4835 14.8428 6.35921 14.8817 6.23289 14.876C6.10657 14.8704 5.98627 14.8205 5.89302 14.7351L5.17702 14.0801C5.12135 14.0288 5.07691 13.9666 5.04652 13.8973C5.01612 13.828 5.00043 13.7532 5.00043 13.6776C5.00043 13.6019 5.01612 13.5271 5.04652 13.4578C5.07691 13.3885 5.12135 13.3263 5.17702 13.2751L7.11202 11.5001L5.17702 9.72506C5.12135 9.67383 5.07691 9.6116 5.04652 9.54232C5.01612 9.47304 5.00043 9.39821 5.00043 9.32256C5.00043 9.2469 5.01612 9.17207 5.04652 9.10279C5.07691 9.03351 5.12135 8.97129 5.17702 8.92006L5.89302 8.26506C5.98639 8.17981 6.10676 8.13009 6.23307 8.12461C6.35939 8.11912 6.48361 8.15822 6.58402 8.23506L8.81602 9.93706L13.94 5.24006C14.0583 5.12088 14.2107 5.04159 14.3762 5.01327C14.5417 4.98494 14.7119 5.00899 14.863 5.08206L17.54 6.37606C17.821 6.51206 18 6.79806 18 7.11206V12.0001H14.752V8.53406L10.864 11.5001L14.752 14.4661V12.0001H18V15.8891C18 16.2031 17.821 16.4891 17.54 16.6251L14.863 17.9201Z"
            fill="currentColor"
          />
        </svg>
      );

    case "noborder-vscode":
      return (
        <svg
          width="13"
          height="13"
          viewBox="0 0 13 13"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            d="M9.86306 12.9201C9.71186 12.9931 9.54156 13.0171 9.37606 12.9886C9.21056 12.9601 9.05816 12.8805 8.94006 12.7611L3.81608 8.0631L1.58408 9.7661C1.48356 9.8428 1.35927 9.8817 1.23295 9.876C1.10663 9.8704 0.986328 9.8205 0.893078 9.7351L0.177078 9.0801C0.121408 9.0288 0.0769684 8.9666 0.0465784 8.8973C0.0161784 8.828 0.000488281 8.7532 0.000488281 8.6776C0.000488281 8.6019 0.0161784 8.5271 0.0465784 8.4578C0.0769684 8.3885 0.121408 8.3263 0.177078 8.2751L2.11208 6.5001L0.177078 4.72506C0.121408 4.67383 0.0769684 4.6116 0.0465784 4.54232C0.0161784 4.47304 0.000488281 4.39821 0.000488281 4.32256C0.000488281 4.2469 0.0161784 4.17207 0.0465784 4.10279C0.0769684 4.03351 0.121408 3.97129 0.177078 3.92006L0.893078 3.26506C0.986448 3.17981 1.10682 3.13009 1.23313 3.12461C1.35945 3.11912 1.48367 3.15822 1.58408 3.23506L3.81608 4.93706L8.94006 0.240058C9.05836 0.120878 9.21076 0.0415881 9.37626 0.0132681C9.54176 -0.0150619 9.71196 0.0089881 9.86306 0.0820581L12.5401 1.37606C12.8211 1.51206 13.0001 1.79806 13.0001 2.11206V7.0001H9.75206V3.53406L5.86406 6.5001L9.75206 9.4661V7.0001H13.0001V10.8891C13.0001 11.2031 12.8211 11.4891 12.5401 11.6251L9.86306 12.9201Z"
            fill="currentColor"
          />
        </svg>
      );

    case "countdown-timer":
      return (
        <svg
          width="20"
          height="20"
          xmlns="http://www.w3.org/2000/svg"
          fill="none"
          viewBox="0 0 20 20"
          className={className}
        >
          <path
            fill="currentColor"
            d="M20.25 10.812c-.462 5.37-5.191 9.35-10.562 8.888C4.316 19.238.337 14.51.798 9.138a9.761 9.761 0 0 1 8.89-8.89.753.753 0 0 1 .123 1.5 8.262 8.262 0 1 0 8.937 8.938.752.752 0 1 1 1.5.124l.002.002ZM9.75 4.75V10c0 .413.336.75.75.75h5.25a.751.751 0 0 0 0-1.5h-4.5v-4.5a.75.75 0 0 0-1.5 0ZM13.5 2.5a1.126 1.126 0 1 0-.002-2.252A1.126 1.126 0 0 0 13.5 2.5Zm3.375 2.25a1.126 1.126 0 1 0-.002-2.252 1.126 1.126 0 0 0 .002 2.252Zm2.25 3.375a1.126 1.126 0 1 0-.002-2.252 1.126 1.126 0 0 0 .002 2.252Z"
          />
        </svg>
      );
  }
}

export const codemodBrandString = `
  <svg
    width="20"
    height="20"
    viewBox="0 0 20 20"
    fill="none"
    xmlns="http://www.w3.org/2000/svg"
  >
    <rect width="20" height="20" rx="4.26667" fill="#D6FF62" />
    <mask
      id="mask0_3269_819"
      style={{
        maskType: "luminance",
      }}
      maskUnits="userSpaceOnUse"
      x="3"
      y="3"
      width="15"
      height="12"
    >
      <path d="M17.2001 3.91504H3.00024V14.512H17.2001V3.91504Z" fill="white" />
    </mask>
    <g mask="url(#mask0_3269_819)">
      <path
        d="M3.00024 14.3389L7.07143 3.91504H8.42849L4.34301 14.3389H3.00024Z"
        fill="#0B151E"
      />
      <path
        d="M11.0815 7.07682C12.8573 7.07682 14.0989 8.08738 14.3445 9.66114H12.9875C12.7565 8.76611 12.0345 8.28941 11.1251 8.28941C9.84033 8.28941 8.95957 9.27098 8.95957 10.8015C8.95957 12.332 9.78236 13.2993 11.0676 13.2993C12.0349 13.2993 12.7569 12.794 13.0022 11.9565H14.3592C14.085 13.487 12.7712 14.5119 11.0676 14.5119C8.98853 14.5119 7.61719 13.0393 7.61719 10.8158C7.61719 8.59225 9.01752 7.07642 11.0823 7.07642L11.0815 7.07682Z"
        fill="#0B151E"
      />
      <path
        d="M15.0807 13.5013C15.0807 12.9381 15.557 12.4761 16.1202 12.4761C16.6834 12.4761 17.1455 12.9381 17.1455 13.5013C17.1455 14.0645 16.6691 14.5119 16.1202 14.5119C15.5713 14.5119 15.0807 14.0499 15.0807 13.5013Z"
        fill="#0B151E"
      />
    </g>
  </svg>
  `;

export const codemodLogoString = `
  <svg
      width="133"
      height="22"
      viewBox="0 0 133 22"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
    >
      <g clipPath="url(#clip0_2887_5290)">
        <mask
          id="mask0_2887_5290"
          style={{
            maskType: "alpha",
          }}
          maskUnits="userSpaceOnUse"
          x="0"
          y="0"
          width="133"
          height="22"
        >
          <rect width="132.71" height="21.8986" fill="#D9D9D9" />
        </mask>
        <g mask="url(#mask0_2887_5290)">
          <path
            d="M0 21.4475L8.19082 0.475708H10.9211L2.70153 21.4475H0Z"
            className="fill-primary-light dark:fill-primary-dark"
          />
        </g>
        <mask
          id="mask1_2887_5290"
          style={{
            maskType: "alpha",
          }}
          maskUnits="userSpaceOnUse"
          x="0"
          y="0"
          width="133"
          height="22"
        >
          <rect width="132.71" height="21.8986" fill="#D9D9D9" />
        </mask>
        <g mask="url(#mask1_2887_5290)">
          <path
            d="M16.3478 6.89759C19.9371 6.89759 22.4465 8.94014 22.9431 12.1211H20.2002C19.7333 10.312 18.274 9.34849 16.436 9.34849C13.8391 9.34849 12.0589 11.3325 12.0589 14.426C12.0589 17.5195 13.722 19.4746 16.3197 19.4746C18.2748 19.4746 19.7341 18.4533 20.2299 16.7605H22.9728C22.4185 19.854 19.763 21.9255 16.3197 21.9255C12.1175 21.9255 9.3457 18.9491 9.3457 14.4548C9.3457 9.96061 12.1761 6.89679 16.3494 6.89679L16.3478 6.89759Z"
            className="fill-primary-light dark:fill-primary-dark"
          />
        </g>
        <mask
          id="mask2_2887_5290"
          style={{
            maskType: "alpha",
          }}
          maskUnits="userSpaceOnUse"
          x="0"
          y="0"
          width="133"
          height="22"
        >
          <rect width="132.71" height="21.8986" fill="#D9D9D9" />
        </mask>
        <g mask="url(#mask2_2887_5290)">
          <path
            d="M31.7827 6.92651C36.0435 6.92651 39.1948 10.02 39.1948 14.426C39.1948 18.832 36.0435 21.9255 31.7827 21.9255C27.5219 21.9255 24.3418 18.832 24.3418 14.426C24.3418 10.02 27.4931 6.92651 31.7827 6.92651ZM31.7827 19.4746C34.5256 19.4746 36.4519 17.4024 36.4519 14.426C36.4519 11.4496 34.5256 9.37741 31.7827 9.37741C29.0398 9.37741 27.1136 11.4496 27.1136 14.426C27.1136 17.4024 29.0101 19.4746 31.7827 19.4746Z"
            className="fill-primary-light dark:fill-primary-dark"
          />
        </g>
        <mask
          id="mask3_2887_5290"
          style={{
            maskType: "alpha",
          }}
          maskUnits="userSpaceOnUse"
          x="0"
          y="0"
          width="133"
          height="22"
        >
          <rect width="132.71" height="21.8986" fill="#D9D9D9" />
        </mask>
        <g mask="url(#mask3_2887_5290)">
          <path
            d="M40.709 14.4846C40.709 10.1075 43.2481 6.89763 47.4792 6.89763C49.6678 6.89763 51.5066 7.86034 52.4693 9.61167V0.0985107H55.1833V21.5757H52.7324L52.4989 18.9788C51.5651 20.9339 49.6389 21.9263 47.3629 21.9263C43.2192 21.9263 40.7098 18.8328 40.7098 14.4854L40.709 14.4846ZM52.4396 14.3971C52.4396 11.4793 50.7179 9.37821 47.9165 9.37821C45.115 9.37821 43.4808 11.4793 43.4808 14.3971C43.4808 17.3149 45.115 19.4457 47.9165 19.4457C50.7179 19.4457 52.4396 17.3735 52.4396 14.3971Z"
            className="fill-primary-light dark:fill-primary-dark"
          />
        </g>
        <mask
          id="mask4_2887_5290"
          style={{
            maskType: "alpha",
          }}
          maskUnits="userSpaceOnUse"
          x="0"
          y="0"
          width="133"
          height="22"
        >
          <rect width="132.71" height="21.8986" fill="#D9D9D9" />
        </mask>
        <g mask="url(#mask4_2887_5290)">
          <path
            d="M56.7578 14.4558C56.7578 9.99121 59.5882 6.89771 63.7318 6.89771C67.8755 6.89771 70.4435 9.69918 70.4435 13.9303V14.9516L59.4133 14.9804C59.6179 17.9865 61.1935 19.6496 63.9075 19.6496C66.0375 19.6496 67.4383 18.7743 67.9052 17.1401H70.4732C69.7728 20.2039 67.3797 21.9256 63.849 21.9256C59.6467 21.9256 56.7578 18.8906 56.7578 14.455V14.4558ZM59.4718 13.1425H67.7014C67.7014 10.779 66.1546 9.20339 63.7326 9.20339C61.3106 9.20339 59.8224 10.633 59.4718 13.1425Z"
            className="fill-primary-light dark:fill-primary-dark"
          />
        </g>
        <mask
          id="mask5_2887_5290"
          style={{
            maskType: "alpha",
          }}
          maskUnits="userSpaceOnUse"
          x="0"
          y="0"
          width="133"
          height="22"
        >
          <rect width="132.71" height="21.8986" fill="#D9D9D9" />
        </mask>
        <g mask="url(#mask5_2887_5290)">
          <path
            d="M72.0488 21.5758V7.30605H74.4997L74.7621 9.17371C75.4913 7.83153 77.0092 6.89771 79.0228 6.89771C81.2403 6.89771 82.8167 8.00642 83.546 9.78663C84.2174 8.00642 85.9391 6.89771 88.1565 6.89771C91.4249 6.89771 93.4089 8.94025 93.4089 12.2375V21.5758H90.7246V12.909C90.7246 10.6619 89.4698 9.37828 87.5436 9.37828C85.4714 9.37828 84.1003 10.8376 84.1003 13.1136V21.5758H81.3863V12.8801C81.3863 10.633 80.1604 9.40716 78.235 9.40716C76.1628 9.40716 74.7917 10.8368 74.7917 13.1128V21.575H72.0488V21.5758Z"
            className="fill-primary-light dark:fill-primary-dark"
          />
        </g>
        <mask
          id="mask6_2887_5290"
          style={{
            maskType: "alpha",
          }}
          maskUnits="userSpaceOnUse"
          x="0"
          y="0"
          width="133"
          height="22"
        >
          <rect width="132.71" height="21.8986" fill="#D9D9D9" />
        </mask>
        <g mask="url(#mask6_2887_5290)">
          <path
            d="M102.687 6.92651C106.948 6.92651 110.099 10.02 110.099 14.426C110.099 18.832 106.948 21.9255 102.687 21.9255C98.4262 21.9255 95.2461 18.832 95.2461 14.426C95.2461 10.02 98.3974 6.92651 102.687 6.92651ZM102.687 19.4746C105.43 19.4746 107.356 17.4024 107.356 14.426C107.356 11.4496 105.43 9.37741 102.687 9.37741C99.9441 9.37741 98.0179 11.4496 98.0179 14.426C98.0179 17.4024 99.9144 19.4746 102.687 19.4746Z"
            className="fill-primary-light dark:fill-primary-dark"
          />
        </g>
        <mask
          id="mask7_2887_5290"
          style={{
            maskType: "alpha",
          }}
          maskUnits="userSpaceOnUse"
          x="0"
          y="0"
          width="133"
          height="22"
        >
          <rect width="132.71" height="21.8986" fill="#D9D9D9" />
        </mask>
        <g mask="url(#mask7_2887_5290)">
          <path
            d="M111.615 14.4846C111.615 10.1075 114.154 6.89763 118.385 6.89763C120.574 6.89763 122.413 7.86034 123.376 9.61167V0.0985107H126.09V21.5757H123.639L123.405 18.9788C122.471 20.9339 120.545 21.9263 118.269 21.9263C114.125 21.9263 111.616 18.8328 111.616 14.4854L111.615 14.4846ZM123.346 14.3971C123.346 11.4793 121.624 9.37821 118.823 9.37821C116.021 9.37821 114.387 11.4793 114.387 14.3971C114.387 17.3149 116.021 19.4457 118.823 19.4457C121.624 19.4457 123.346 17.3735 123.346 14.3971Z"
            className="fill-primary-light dark:fill-primary-dark"
          />
        </g>
        <mask
          id="mask8_2887_5290"
          style={{
            maskType: "alpha",
          }}
          maskUnits="userSpaceOnUse"
          x="0"
          y="0"
          width="133"
          height="22"
        >
          <rect width="132.71" height="21.8986" fill="#D9D9D9" />
        </mask>
        <g mask="url(#mask8_2887_5290)">
          <path
            d="M128.539 19.8837C128.539 18.7453 129.502 17.8115 130.64 17.8115C131.779 17.8115 132.712 18.7453 132.712 19.8837C132.712 21.0221 131.75 21.9262 130.64 21.9262C129.531 21.9262 128.539 20.9924 128.539 19.8837Z"
            className="fill-primary-light dark:fill-primary-dark"
          />
        </g>
      </g>
      <defs>
        <clipPath id="clip0_2887_5290">
          <rect width="132.713" height="22" fill="white" />
        </clipPath>
      </defs>
    </svg>
    `;
